<template>
  <page-header-wrapper>
    <a-button @click="newShow = true" type="primary">
      新增
    </a-button>
    <a-table :columns="columns" :data-source="listData" :loading="loading" :pagination="false">
      <span slot="action" slot-scope="text, record">
        <template>
          <a-select :default-value="record.centerName" style="width: 120px" @change="handleChange" @focus="focus(record)">
            <a-select-option :key="item.centerID" v-for="item in selectData">
              {{ item.name }}
            </a-select-option>
          </a-select>
        </template>
      </span>
    </a-table>

    <a-modal v-model="newShow" title="新增" @ok="neww">
      <a-input v-model="text"/>
    </a-modal>

  </page-header-wrapper>
</template>

<script>

export default {
  name: 'TableList',
  // components: {
  //   STable
  // },
  data () {
    return {
      loading: false,
      editShow: false,
      newShow: false,
      searchText: '',
      text: '',
      current: {},
      listData: [],
      // 表头
      columns: [
        {
          title: 'id',
          dataIndex: 'id'
        },
        {
          title: '快递公司',
          dataIndex: 'coName'
        },
        {
          title: '创建时间',
          dataIndex: 'createTime'
        },
        {
          title: '集散地',
          dataIndex: 'action',
          width: '250px',
          scopedSlots: { customRender: 'action' }
        }
      ]
    }
  },
  created () {
    this.getList()
  },
  methods: {
    focus (value) {
      this.current = value
      console.log(this.current)
    },
    handleChange (value) {
      this.loading = true

      const param = {
        CenterID: value, CoName: this.current.coName
      }
      this.fetchList('/parcelCenterCo/change', param).then(res => {
        this.getList()
      })
    },
    getList () {
      this.loading = true
      this.fetchList('/parcelCenter/getBySchool').then(res => {
        this.selectData = res.data
        this.loading = false
      })

      this.fetchList('/co/getAll').then(res => {
        this.listData = res.data
        this.loading = false
      })
    },
    neww () {
      const item = {
        CoName: this.text
      }
      this.fetchList('/co/new', item).then(data => {
        this.getList()
        this.newShow = false
      })
    },
    edit (item) {
      this.current = item
      this.text = item.name
      this.editShow = true
    },
    del (item) {
      item.deleted = 1
      this.loading = true
      this.fetchList('/parcelCenter/update', item).then(data => {
        this.getList()
      })
    }
  }
}
</script>
